(function($, undefined) {

    window.slideshow = {
        options: {
            defaults: {
                captionAndToolbarAutoHideDelay: 0,
                preventSlideshow: true,
                captionAndToolbarFlipPosition: true,
                enableMouseWheel: false, 
    			enableKeyboard: false
            }
        },
        caption: {
            withCountsAndNextCategory: function(el, line1Text, line2Text) {
                var link = $(el);
                var group = link.closest('.photoGroup');
                var groupLinks = group.find('a');
                var container = group.parent();
                var containerGroups = container.find('.photoGroup');
                var containerCount = containerGroups.index(group) +1;
                var containerSize = containerGroups.length;

                var captionText = link.attr('title');
                var groupText = group.find('h2').text();
                var groupCount = groupLinks.index(link) +1;
                var groupSize = groupLinks.length;
                var nextGroupText;
                // The "Swipe for ___" text is only shown when the slideshow has
                // more than one group and the user is on the last slide in a group.
                if(containerSize > 1 && groupCount === groupSize) {
                    var nextContainerIndex;
                    if(containerCount === containerSize) {
                        nextContainerIndex = 0;
                    } else {
                        nextContainerIndex = containerCount;
                    }
                    nextGroupText = $(containerGroups.get(nextContainerIndex)).find('h2').text();
                }

                //var line1 = line1Text.replace('{0}', groupText).replace('{1}', groupCount).replace('{2}', groupSize);
                var line1 = groupText + " " + line1Text.replace('{0}', groupCount).replace('{1}', groupSize);
                var line2 = line2Text.replace('{0}', nextGroupText);
                var line3 = captionText;

                var caption = $('<div class="slideshow-captionBlock"/>');
                caption.append('<p class="status">' + line1 + '</p>');
                if(nextGroupText) {
                    caption.append('<p class="nextGroup">' + line2 + '</p>');
                }
                caption.append('<p class="caption">' + line3 + '</p>');

                return caption;
            },
            withCounts: function(obj, line1Text) {
                //var line1 = line1Text.replace('{0}', obj.groupText).replace('{1}', obj.groupCount).replace('{2}', obj.groupSize);
                var line1 = line1Text.replace('{0}', obj.groupCount).replace('{1}', obj.groupSize);
                var line2 = obj.caption;

                var caption = $('<div class="slideshow-captionBlock"/>');
                caption.append('<p class="status">' + line1 + '</p>');
                caption.append('<p class="caption">' + line2 + '</p>');

                return caption;
            },
            withCountsAndCustomCaption: function(obj, line1Text, line2Text) {
            	var link = $(obj);
                var group = link.closest('.photoGroup');
                var groupLinks = group.find('a');
                var container = group.parent();
                var containerGroups = container.find('.photoGroup');
                var containerCount = containerGroups.index(group) +1;
                var containerSize = containerGroups.length;

                var captionText = link.attr('title');
                var groupText = group.find('h2').text();
                var groupCount = groupLinks.index(link) +1;
                var groupSize = groupLinks.length;
                var nextGroupText;
            	var line1 = line1Text.replace('{0}', groupCount).replace('{1}', groupSize);
                var line2 = line2Text;

                var caption = $('<div class="slideshow-captionBlock"/>');
                caption.append('<p class="status">' + line1 + '</p>');
                caption.append('<p class="caption">' + line2 + '</p>');

                return caption;
            },
            withCountsAndNextCategoryAndTitles: function(el, line1Text, line2Text) {
                var link = $(el);
                var group = link.closest('.photoGroup');
                var groupLinks = group.find('a');
                var container = group.parent();
                var containerGroups = container.find('.photoGroup');
                var containerCount = containerGroups.index(group) +1;
                var containerSize = containerGroups.length;

                var captionText = link.attr('title');
                var titleText = link.attr("data-title");
                var subTitleText = link.attr("data-subtitle");
                var groupText = group.find('h2').text();
                var groupCount = groupLinks.index(link) +1;
                var groupSize = groupLinks.length;
                var nextGroupText;
                // The "Swipe for ___" text is only shown when the slideshow has
                // more than one group and the user is on the last slide in a group.
                if(containerSize > 1 && groupCount === groupSize) {
                    var nextContainerIndex;
                    if(containerCount === containerSize) {
                        nextContainerIndex = 0;
                    } else {
                        nextContainerIndex = containerCount;
                    }
                    nextGroupText = $(containerGroups.get(nextContainerIndex)).find('h2').text();
                }

                //var line1 = line1Text.replace('{0}', groupText).replace('{1}', groupCount).replace('{2}', groupSize);
                var line1 = groupText + " " + line1Text.replace('{0}', groupCount).replace('{1}', groupSize);
                var line2 = line2Text.replace('{0}', nextGroupText);
                var line3 = captionText;

                var caption = $('<div class="slideshow-captionBlock"/>');
                caption.append('<p class="status">' + line1 + '</p>');
                if(nextGroupText) {
                    caption.append('<p class="nextGroup">' + line2 + '</p>');
                }
                caption.append('<p class="caption" data-subtitle="' + subTitleText + '" data-title="' + titleText + '">' + line3 + '</p>');
                return caption;
            }
        },
        toolbar: {
            closeButtonOnly: function(el, closeButtonText, titleText){
                return '<div class="ps-toolbar-close"><span class="nav-close-x closeBKGD text" aria-hidden="true" data-icon="&#xe019;"></span><span class="text">' + closeButtonText + '</span></div>';
            },
            closeButtonAndTitle: function(el, closeButtonText, titleText){
                var titleTextChecked = '';

                if(titleText !== undefined){
                    titleTextChecked = titleText;
                }

                return '<div class="ps-toolbar-label"><span class="title" id="photoTitle">'+titleTextChecked+'</span><span class="subTitle" id="photoSubtitle"></span></div><div class="ps-toolbar-close"><a href="#" class="closeButton"><span class="nav-close-x closeBKGD text" aria-hidden="true" data-icon="&#xe019;"></span><span class="text">' + closeButtonText + '</span></a></div>';
            }
        }
    };

    $.fn.slideshow = function(context, toolbarFunction, captionFunction, images, indicators, spgCard) {
    	console.log("Slide show initiated");
    	var ps = window.Code.PhotoSwipe;
    	var photoSwipeParams = $.extend({}, slideshow.options.defaults, context);
        if(toolbarFunction) {
            photoSwipeParams.getToolbar = function(el) {
                return toolbarFunction(el, context.closeButtonText, context.titleText);
            };
        }
        if(captionFunction) {
            photoSwipeParams.getImageCaption = function(el) {
                return captionFunction(el, context.line1Text, context.line2Text);
            };
        }

        if(images){
        	var instance = ps.attach(images, photoSwipeParams);
        }else{
        	var instance = this.photoSwipe(photoSwipeParams);
        }

        if(indicators){
        	//show our indicator dots based on number of images
        	instance.addEventHandler(ps.EventTypes.onDisplayImage, function(e){
        		var i, len;
        		for (i=0, len=indicators.length; i<len; i++){
        			indicators[i].setAttribute('class', '');
        		}
        		indicators[e.index].setAttribute('class', 'current');
        	});
        }
        
        instance.addEventHandler(Code.PhotoSwipe.EventTypes.onBeforeShow, function(e){
            // Make the browser chrome scroll out of the way on iOS.
            if($(window).scrollTop() === 0) {
                $(window).scroll(0);
            };
        });
        
        //On any swipe event, check for loading 
		instance.addEventHandler(ps.EventTypes.onTouch, function(e){
			if(e.action == 'swipeLeft' || e.action == 'swipeRight'){
				//$.showLoadingIcon('#fff');
			}

		});
		
		$.showLoadingIcon('#ffffff', instance, ps, '.ps-carousel');

        $(document).live('DOMSubtreeModified', '.ps-caption-content', function(){
            var titleText = $('.caption').data('title');

            if(titleText !== undefined && titleText !== null && titleText !== 'undefined' && titleText !== ''){
                $('#photoTitle').html(titleText);
            }

            var subTitleText = $('.caption').data('subtitle');

            if(subTitleText !== undefined && subTitleText !== null && subTitleText !== 'undefined'){
                $('#photoSubtitle').html(subTitleText);
            }
        });

        return instance;
    };

})(jQuery);